<template>
  <div class="mv-details">
    <div class="list">
      <van-image :src="album.coverUrl" radius="50%"></van-image>
      <div>{{ album.albumName }}</div>
      <div v-for="(item, index) in descr" :key="index" class="a">
        <div class="details">{{ item.resource }}</div>
      </div>
      <!-- <div v-for="(item, index) in album" :key="index" class="mv">
            <h4>{{ item.albumName }}</h4>
            <div class="singers">
              <span v-for="(singer, index) in item.singer" :key="index"
                >{{ singer.name }}
                <span v-show="index != item.singer.length - 1"> / </span>
              </span>
              <span v-show="item.album.name">
                <span>·</span>
                <span>{{ item.album.name }}</span>
              </span>
              <span v-show="item.subtitle">
                <span>·</span>
                <span>{{ item.subtitle }}</span>
              </span>
            </div>
          </div> -->
      <van-list></van-list>
    </div>
  </div>
</template>
  <script>
// window.onload = function(){
//   var a = document.getElementsByClassName("a");
//   for(let i = 0;i<a.length;i++){
//     var details = document.getElementsByClassName("details")[i].innerText;
//     if(details == "<br>"){
//       continue;
//     }
//     console.log(details)
//   }
// }
export default {
  props: ["mvId"],
  data() {
    return {
      album: [], //vant的list列表数据
      // loading: false,
      // finished: false,
      // page: 1, //获取api数据的页码
      descr: [],
    };
  },
  created() {
    this.getData();
  },
  methods: {
    getData() {
      this.$request("get", "/album/detail", {
        id: this.mvId,
        //   num: 30,
        //   page: this.page,
      }).then((res) => {
        //console.log(res);
        this.album = res.album;
        this.descr = res.product.descr;
      });
    },
  },
};
</script>
  <style scoped>
.header > span {
  font-size: 0.9rem;
}
.mv h4 {
  text-align: left;
  font-size: 1rem;
  padding: 0 2rem;
  /* margin: 0; */
}
.mv {
  margin-bottom: 1rem;
}
.mv {
  text-align: left;
  padding: 0 2rem;
}
.mv span {
  color: rgb(147, 147, 147);
  font-size: 0.8rem;
}
.mv > span:nth-last-child(2) > span:first-child {
  color: red;
  font-weight: 900;
  padding: 0 0.5rem;
}
.mv > span:nth-last-child(1) > span:first-child {
  color: red;
  font-weight: 900;
  padding: 0 0.5rem;
}
.list {
  margin: 0 1rem;
}
.van-image {
  width: 150px;
  height: 150px;
}
</style>
  
